<template>
  <div class="about">
    <h1>This is an about page</h1>
    <div>{{num}}</div>
    <div>{{arr}}</div>
    <button @click="add">新增</button>
  </div>
</template>

<script setup>
//! 对于这种原本写在setup函数中的代码，直接写在设置有setup属性的script中，这是vue3的语法糖 
import { reactive , ref } from 'vue';
//1 定义响应式数据
var num = ref(0)
var arr = ref([])




var add = () => {
  arr.value.push(parseInt(Math.random()*10))
}

</script>

<style scoped>

</style>
